<#include "/common/head.html"/>
<script type="text/javascript" src="${basePath}/js/ZeroClipboard/ZeroClipboard.min.js"></script>
    <table id="dg" class="easyui-datagrid1" 
            data-options1="
            	rownumbers:true,
            	fit:true,
            	border:false,
            	rownumbers:true,
            	url:'listData',
            	method:'get',
            	toolbar:'#tb',
            	pagination:true">
        <thead>
            <tr>
            	<th data-options="field:'id',checkbox:true"></th>
                <th data-options="field:'form_name',width:120">表单名称</th>
                <th data-options="field:'table_name',width:120">数据库表名</th>
                <th data-options="field:'id_field',width:120">主键字段</th>
                <th data-options="field:'is_auto',width:120">是否自增</th>
                <th data-options="field:'create_time',width:120">创建时间</th>
                <th data-options="field:'operate',width:120,
                	formatter: function(value, row, index){
						return '<a class=operate href=### onclick=preview(' + index + ')>预览</a><a class=operate data-clipboard-target=fe_text href=### onclick=copyUrl(this, ' + index + ')>复制地址</a>';
					}
                ">操作</th>
            </tr>
        </thead>
    </table>
    <div id="tb" style="padding:2px 5px;">
        <div class="wrap_search">
            <span class="search_item">
                <span class="item_text">表单名称: </span>
                <span class="item_obj">
                    <input class="easyui-textbox" type="text" name="form_name" />
                </span>    
            </span>
            <span class="search_item">
                <span class="item_text">数据库表名: </span>
                <span class="item_obj">
                    <input class="easyui-textbox" type="text" name="table_name" />
                </span>    
            </span>
            <span class="search_item">
                <span class="item_text">是否自增:</span>
                <span class="item_obj">
                    <select class="easyui-combobox" name="is_auto" panelHeight="auto" style="width:100px">
                        <option value="1">是</option>
                        <option value="0">否</option>
                    </select>
                </span>
            </span>
            <span class="search_item search_between">
                <span class="item_text">日期: </span>
                <span class="item_obj">
                    <input class="easyui-datebox" name="_start_create_time"/> ～ <input class="easyui-datebox" name="_end_create_time"/>
                </span>
            </span>
        </div>
        <div style="text-align: left; margin:6px;">
            <a href="#" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="update()">编辑</a>
            <a href="#" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="genForm()">生成表单</a>
            <div style="float:right; padding-right:40px;">
                <a href="#" class="easyui-linkbutton" iconCls="icon-search" onclick="zcurdSearch(this)">搜索</a>
                <a href="#" class="easyui-linkbutton" iconCls="icon-search">重置</a>
            </div>
        </div>
    </div>

    <div id="ft" style="padding:2px 5px;">
        <a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="alert('增加')"></a>
        <a href="#" class="easyui-linkbutton" iconCls="icon-edit" plain="true"></a>
        <a href="#" class="easyui-linkbutton" iconCls="icon-save" plain="true"></a>
        <a href="#" class="easyui-linkbutton" iconCls="icon-cut" plain="true"></a>
        <a href="#" class="easyui-linkbutton" iconCls="icon-remove" plain="true"></a>
    </div>
<script type="text/javascript">
var datagrid = $("#dg");
$(function() {
	datagrid.datagrid({
		rownumbers:true,
    	fit:true,
    	border:false,
    	rownumbers:true,
    	url:'listData',
    	method:'get',
    	toolbar:'#tb',
    	pagination:true,
    	columns:[[
	    	{field:'id', checkbox:true},
	    	{field:'form_name', title: '表单名称', width:120},
	    	{field:'table_name', title: '数据库表名', width:120},
	        {field:'id_field', title: '主键字段', width:120},
	        {field:'is_auto', title: '是否自增', width:120},
	        {field:'create_time', title: '创建时间', width:120},
	        {field:'operate', title: '操作', width:120, 
	        	formatter: function(value, row, index){
				  	return '<a class="operate" href="###" onclick="preview(' + index + ')">预览</a>' + 
				  		   '<a class="operate" id="copyBtn' + index + '" data-clipboard-target="fe_text' + index + '" href="###" onclick1="copyUrl(this, ' + index + ')">复制地址</a>';
			  	} 
	        }
	    ]],
	    onLoadSuccess: function(data) {
	    	//处理复制
	    	$.each(datagrid.datagrid("getRows"), function(i) {
	    		copyUrl($("#copyBtn" + i).get(0), i);
	    	});
	    }
	});
});

//预览
function preview(index) {
	var row = datagrid.datagrid("getRows")[index];
	top.window.addMainTab("[预览]" + row.form_name, "../zcurd/listPage?headId=" + row.id);
}

//复制地址
function copyUrl(obj, index) {
	var row = datagrid.datagrid("getRows")[index];
	$('<textarea id="fe_text' + index + '"></textarea>').text("../zcurd/listPage?headId=" + row.id).hide().appendTo("body");
	var clip = new ZeroClipboard(obj, {
  		moviePath: "${basePath}/js/ZeroClipboard/ZeroClipboard.swf"
	});
	clip.on('complete', function(client, args) {
		showMsg("复制成功, 内容为：" + args.text)
	});
}

//搜索
function zcurdSearch() {
	var param = zcurdGetParam();
	log(param);
	datagrid.datagrid("load", {
		queryParams: param
	})
}

function zcurdGetParam() {
	var param = {};
	$("#tb :input[name]").each(function(i, item) {
		if($(item).val()) {
			param[$(item).attr("name")] = $(item).val();	
		}
	});
	return param;
}

function update() {
	var rowsSel = datagrid.datagrid("getSelections");
	if(rowsSel.length != 1) {
		showWarnMsg("请选择需要编辑的一条数据！");
		return;
	}
	top.window.subPage.loadCurrDatagrid = function() {
		datagrid.datagrid("load");
	}
	var id = rowsSel[0].id;
	top.openWindow("编辑", "updatePage?id=" + id);
}

function genForm() {
	top.window.subPage.loadCurrDatagrid = function() {
		datagrid.datagrid("load");
	}
	top.openWindow("生成表单", "genFormPage");
}

function log(obj) {
	console.log(obj);
}
</script>

<#include "/common/foot.html"/>